<!-- pdf展示组件，根据数据字典的值来判断使用哪个组件
    根据数据字典code值PDF_KIND设置： 1  index3:翻页组件 2 index4:滚动 3 index5: 滚动不带控制栏 
    wjanme：文件名称 src:文件地址
    组件接受一个文件地址(必须),一个文件名
 -->
<template>
  <div class="box">
    <!-- <PdfPreview wjName="01.pdf" :src="httpUrl" /> -->
    <component :is="componentName" :wjName="wjName" :src="httpUrl"></component>
  </div>
</template>
<script>
export default {
  components: {
    PdfPreview1: () => import('./index3.vue'),
    PdfPreview2: () => import('./index4.vue'),
    PdfPreview3: () => import('./index5.vue'),
  },
  props: ['src', 'wjName'],
  data() {
    return {
      componentName: 'PdfPreview2',
      httpUrl: '',
    }
  },
  mounted() {
    this.getKind()
  },
  watch: {
    src: {
      handler: function (val) {
        if (val) {
          this.httpUrl = val
        }
      },
      immediate:true
    },
    '$route':{
      handler:function(val){
        const url = this.$route.query.fileUrl;
        if(url){
          this.httpUrl = url;
        }
      },
      immediate:true
    }
  },
  methods: {
    async getKind() {
      const res = await this.$store.dispatch('getDictByCode', 'PDF_KIND')
      switch (res) {
        case '1':
          this.componentName = 'PdfPreview1'
          break
        case '2':
          this.componentName = 'PdfPreview2'
          break
        case '3':
          this.componentName = 'PdfPreview3'
          break
      }
    },
    //http://47.101.197.7:8081/hkdb/busi/2022/12/3/pptx/1670050977504_4498.pdf
    //http://192.168.0.199:8083/system/2023/2/9/1675914903028_9420.pdf
    //http://47.101.197.7:8081/hkdb/busi/2023/2/15/1676428646596_1026.pdf
    //http://47.101.197.7:8081/hkdb/busi/2023/2/15/1676453086247_6712.pdf
    //http://47.101.197.7:8081/hkdb/busi/2023/2/15/1676453220223_9600.pdf
    //http://47.101.197.7:8081/hkdb/busi/2023/2/15/1676453947551_2915.pdf
    //http://47.101.197.7:8081/hkdb/busi/2023/2/15/1676453982277_8572.pdf
    //http://47.101.197.7:8081/hkdb/busi/2023/2/16/1676509417474_4408.pdf
  },
}
</script>
<style scoped lang="scss">
.box {
  width: 100%;
  height: 100%;
}
</style>